require("../css/motion.less")
document.ready(function () {
    // 获取dom
    let back = document.querySelector("#back")
    back.addEventListener("click", function () {
        history.go(-1)
    })

    let userId=JSON.parse(localStorage.getItem("user")).userId
    console.log(userId);

    // 基于准备好的dom，初始化echarts实例
    var myChart = echarts.init(document.getElementById('main'));
    var myChart2 = echarts.init(document.getElementById('main2'));

    // 指定图表的配置项和数据
    var option = {
        title:{
            text:"近几天运动数据"
        },
        xAxis: {
            type: 'category',
            data: []
        },
        yAxis: {
            type: 'value'
        },
        grid:{
            right:"5%",
            bottom:"15%"
        },
        series: [{
            data: [],
            type: 'bar',
            showBackground: true,
            backgroundStyle: {
                color: 'rgba(180, 180, 180, 0.2)'
            }
        }]
    };

    let obj={
        "骑行":0,
        "跑步":0,
        "训练":0
    }
    var option2 = {
        title: {
            text: '运动分类',
            left: 'left',
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left',
            top:"middle"
        },
        series: [
            {
                name: '访问来源',
                type: 'pie',
                radius: '70%',
                // radius: ['40%',"70%"],
                left:"30%",
                data: [
                    // {value: 1048, name: '搜索引擎'},
                    // {value: 735, name: '直接访问'},
                    // {value: 580, name: '邮件营销'},
                    // {value: 484, name: '联盟广告'},
                    // {value: 300, name: '视频广告'}
                ],
                label: {
                    show: false,
                    position: 'center'
                },
                labelLine: {
                    show: false
                },
                emphasis: {
                    itemStyle: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };

    axios.get($utils.url+`/sport/data/${userId}`)
    .then(function(res){
        console.log(res.data);
        let ret=res.data
        let arr1=ret.data.days
        console.log(arr1);
        let seriesArr=arr1.map(item => item.dayTimes)
        option.xAxis.data=arr1.map(item => item.date)
        option.series[0].data=seriesArr
        // 使用刚指定的配置项和数据显示图表。
        myChart.setOption(option);

        for(let k of arr1){
            for(let s of k.exerciseData){
                obj[s.type] +=(s.time-0)
            }
        }
        let perArr=[]
        for(let k in obj){
            console.log(k);
            perArr.push({
                value:obj[k],
                name:k
            })
        }
        option2.series[0].data=perArr
        //饼图
        myChart2.setOption(option2);
    })
    .catch(function(err){
        console.log(err);
    })


})